<template>
  <img class="bgImg" alt="" :src="BGImage" />
  <div class="f_area">
    <header>
			<h1>智慧水务运维云平台</h1>
		</header>
  </div>
</template>

<script setup lang="ts">
import BGImage from '@C/assets/image/bg.png';

</script>

<style lang="scss" scoped>
.bgImg {
  width: 100%;
	height: 100vh;
	position: fixed;
	left: 0;
	top: 0;
}
h1 {    
  font-size: 48px;
  font-weight: 500;
  color: #FFFFFF;
  letter-spacing: 5px;
}
.f_area {
  display: flex;
  flex-direction: column;
  align-items: center;
  position: absolute;
  text-align: center;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}
</style>